<template>
  <view class="isHelpArea">
    <view class="postage">
      求助&nbsp;<up-switch
        :modelValue="switchValue"
        :size="17"
        activeColor="#36A1EE"
        inactiveColor="#DCDCDC"
        @change="changeSwitchValue"
      ></up-switch>
    </view>
  </view>
</template>

<script setup>
import { ref, toRef, watch, inject, computed } from 'vue';

const props = defineProps({
  modelValue: {
    type: Boolean,
    default: false,
  },
});
const emit = defineEmits(['update:modelValue']);

const switchValue = toRef(props, 'modelValue');
const changeSwitchValue = (val) => {
  emit('update:modelValue', val);
};
</script>

<style lang="scss">
.isHelpArea {
  padding: 0 30rpx;
  border-radius: 10rpx;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.postage {
  display: flex;
  align-items: center;
  font-size: 28rpx;
  color: #333333;
}
</style>
